<template>
  <div class="aa">
    <div class="mainbox">
      <h1 style="margin-left: 30px; line-height: 50px">挂号信息列表</h1>
      <!-- 分割线 -->
      <el-divider></el-divider>
      <div style="width: 96%; height: 500px; margin: 20px auto 0">
        <el-row :gutter="10">
          <el-col :span="4">
            <el-input
              v-model="search"
              placeholder="请输入查找的用户信息"
            ></el-input>
          </el-col>
          <el-col :span="20">
            <el-button type="primary" style="width: 60px">搜索</el-button>
            <el-button
              type="primary"
              style="width: 90px"
              @click="regFormVisible = true"
              >添加挂号</el-button
            >
          </el-col>
        </el-row>
        <el-table :data="regForm.tableData" style="width: 100%">
          <el-table-column label="挂号编号" width="80">
            <template #default="scope">
              <div>{{ scope.row.rid }}</div>
            </template>
          </el-table-column>
          <el-table-column label="科室信息" width="80">
            <template #default="scope">
              <div>{{ scope.row.toInfo }}</div>
            </template>
          </el-table-column>
          <el-table-column label="挂号费" width="80">
            <template #default="scope">
              <div>{{ scope.row.rmoney }}</div>
            </template>
          </el-table-column>
          <el-table-column label="支付类型" width="100">
            <template #default="scope">
              <div>{{ scope.row.rpaymentType }}</div>
            </template>
          </el-table-column>
          <el-table-column label="创建时间" width="180">
            <template #default="scope">
              <div>{{ scope.row.rcreateTime }}</div>
            </template>
          </el-table-column>
          <el-table-column label="就诊时间" width="180">
            <template #default="scope">
              <div>{{ scope.row.rvisitTime }}</div>
            </template>
          </el-table-column>
          <el-table-column label="门诊号" width="100">
            <template #default="scope">
              <div>{{ scope.row.routpatient }}</div>
            </template>
          </el-table-column>
          <el-table-column label="医生姓名" width="100">
            <template #default="scope">
              <div>{{ scope.row.rdoctorName }}</div>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="150">
            <template #default="scope">
              <el-button
                type="danger"
                @click="deleteRid(scope.row.rid)"
                style="padding: 0 10px"
                >消核</el-button
              >
              <el-button type="success" @click="" style="padding: 0 10px"
                >修改</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
  <!-- 挂号模块 -->
  <el-dialog title="用户挂号" v-model="regFormVisible">
    <el-row>
      <el-input
        v-model="healthCardMark"
        style="width: 200px"
        placeholder="请输入内容"
      ></el-input>
      <el-button
        type="primary"
        @click="healthCardMarkSearch()"
        style="padding: 0 10px; margin-left: 20px"
        >查询健康卡</el-button
      >
      <div class="state">
        {{ healthName }}
      </div>
    </el-row>
    <el-form :model="regform">
      <el-form-item label="请选择门诊" class="space" prop="pNomenclature">
        <el-cascader
          :options="options"
          ref="cascader"
          clearable
          @change="handleChange"
        ></el-cascader>
      </el-form-item>
      <el-form-item label="挂号费：" class="space">
        <span>{{ patientRules.dMoney }}</span>
      </el-form-item>
      <el-form-item label="挂号时间段" class="space">
        <!-- v-model="this.patientRules.regTime" -->
        <el-date-picker
          type="date"
          v-model="this.patientRules.regTime"
          placeholder="选择日期"
        >
        </el-date-picker>
      </el-form-item>
    </el-form>
    <div slot="footer">
      <el-button style="padding: 0 15px" @click="regFormVisible = false"
        >取 消</el-button
      >
      <el-button
        style="padding: 0 15px"
        type="primary"
        @click="(regFormVisible = false), notarizeReg()"
        >确 定</el-button
      >
    </div>
  </el-dialog>
</template>

<script>
import { useRouter } from "vue-router";
import { reactive } from "vue";
import api from "@/http/api";
const $router = useRouter();
export default {
  name: "aa",
  setup() {
    const options = reactive({
      tableData: [],
    });
    const regForm = reactive({
      tableData: [],
      rId: "",
      doctorId: "",
      pId: "",
      toId: "",
      rMoney: "",
      rPaymentType: "",
      rCreateTime: "",
      rVisitTime: "",
      rOutpatient: "",
      rDoctorName: "",
    });
    api({
      url: "/tec/tvd/",
      method: "get",
    }).then((res) => {
      //console.log(res.data);
      options.tableData = res.data;
      console.log(options.tableData);
    });

    api({
      url: "/hrsRegNew/findAllReg/",
      method: "get",
    }).then((res) => {
      console.log(res.data);
      regForm.tableData = res.data;
    });

    return { options, regForm };
  },
  data() {
    return {
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 弄",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 弄",
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 弄",
        },
      ],
      regFormVisible: false,
      patientFormVisible: false,
      formLabelWidth: "120px",
      patientform: {
        pName: "",
        pNomenclature: "汉族",
        pSex: "男",
        pAge: "",
        pStatusid: "",
        pPhone: "",
      },
      nationList: [
        {
          id: 1,
          info: "汉族",
          value: 1,
        },
        {
          id: 2,
          info: "壮族",
          value: 2,
        },
        {
          id: 3,
          info: "满族",
          value: 3,
        },
        {
          id: 4,
          info: "回族",
          value: 4,
        },
        {
          id: 5,
          info: "苗族",
          value: 5,
        },
        {
          id: 6,
          info: "维吾尔族",
          value: 6,
        },
        {
          id: 7,
          info: "土家族",
          value: 7,
        },
        {
          id: 8,
          info: "彝族",
          value: 8,
        },
        {
          id: 9,
          info: "蒙古族",
          value: 9,
        },
        {
          id: 10,
          info: "藏族",
          value: 10,
        },
        {
          id: 11,
          info: "布依族",
          value: 11,
        },
        {
          id: 12,
          info: "侗族",
          value: 12,
        },
        {
          id: 13,
          info: "瑶族",
          value: 13,
        },
        {
          id: 14,
          info: "朝鲜族",
          value: 14,
        },
        {
          id: 15,
          info: "白族",
          value: 15,
        },
        {
          id: 16,
          info: "哈尼族",
          value: 16,
        },
        {
          id: 17,
          info: "哈萨克族",
          value: 17,
        },
        {
          id: 18,
          info: "黎族",
          value: 18,
        },
        {
          id: 19,
          info: "傣族",
          value: 19,
        },
        {
          id: 20,
          info: "畲族",
          value: 20,
        },
        {
          id: 21,
          info: "傈僳族",
          value: 21,
        },
        {
          id: 22,
          info: "仡佬族",
          value: 22,
        },
        {
          id: 23,
          info: "东乡族",
          value: 23,
        },
        {
          id: 24,
          info: "高山族",
          value: 24,
        },
        {
          id: 25,
          info: "拉祜族",
          value: 25,
        },
        {
          id: 26,
          info: "水族",
          value: 26,
        },
        {
          id: 27,
          info: "佤族",
          value: 27,
        },
        {
          id: 28,
          info: "纳西族",
          value: 28,
        },
        {
          id: 29,
          info: "羌族",
          value: 29,
        },
        {
          id: 30,
          info: "土族",
          value: 30,
        },
        {
          id: 31,
          info: "仫佬族",
          value: 31,
        },
        {
          id: 32,
          info: "锡伯族",
          value: 32,
        },
        {
          id: 33,
          info: "柯尔克孜族",
          value: 33,
        },
        {
          id: 34,
          info: "达斡尔族",
          value: 34,
        },
        {
          id: 35,
          info: "景颇族",
          value: 35,
        },
        {
          id: 36,
          info: "毛南族",
          value: 36,
        },
        {
          id: 37,
          info: "撒拉族",
          value: 37,
        },
        {
          id: 38,
          info: "布朗族",
          value: 38,
        },
        {
          id: 39,
          info: "塔吉克族",
          value: 39,
        },
        {
          id: 40,
          info: "阿昌族",
          value: 40,
        },
        {
          id: 41,
          info: "普米族",
          value: 41,
        },
        {
          id: 42,
          info: "鄂温克族",
          value: 42,
        },
        {
          id: 43,
          info: "怒族",
          value: 43,
        },
        {
          id: 44,
          info: "京族",
          value: 44,
        },
        {
          id: 45,
          info: "基诺族",
          value: 45,
        },
        {
          id: 46,
          info: "德昂族",
          value: 46,
        },
        {
          id: 47,
          info: "保安族",
          value: 47,
        },
        {
          id: 48,
          info: "俄罗斯族",
          value: 48,
        },
        {
          id: 49,
          info: "裕固族",
          value: 49,
        },
        {
          id: 50,
          info: "乌孜别克族",
          value: 50,
        },
        {
          id: 51,
          info: "门巴族",
          value: 51,
        },
        {
          id: 52,
          info: "鄂伦春族",
          value: 52,
        },
        {
          id: 53,
          info: "独龙族",
          value: 53,
        },
        {
          id: 54,
          info: "塔塔尔族",
          value: 54,
        },
        {
          id: 55,
          info: "赫哲族",
          value: 55,
        },
        {
          id: 56,
          info: "珞巴族",
          value: 56,
        },
      ],

      patientRules: {
        toInfo: "", //诊室
        dMoney: "", //挂号费
        rPaymentType: "微信支付", //支付方式
        regTime: "2023-04-18 10:00:00", //挂号时间
        rOutpatient: "230145",
        rDoctorName: "", //医生名字
      },
      healthCardMark: "",
      healthName: "",
      props: {
        value: "toId",
        label: "toName",
        children: "bsVisits",
      },

      options: [
        //新冠康复门诊
        {
          value: "新冠康复门诊",
          label: "新冠康复门诊",
          children: [
            {
              value: "男科新冠康复门诊",
              label: "男科新冠康复门诊",
              children: [
                {
                  value: "曾顺",
                  label: "曾顺",
                  children: [
                    {
                      value: "50",
                      label: "50",
                    },
                  ],
                },
              ],
            },
            {
              value: "新冠康复后生育门诊",
              label: "新冠康复后生育门诊",
              children: [
                {
                  value: "黄江波",
                  label: "黄江波",
                  children: [
                    {
                      value: "50",
                      label: "50",
                    },
                  ],
                },
              ],
            },
            {
              value: "新冠睡眠障碍康复门诊",
              label: "新冠睡眠障碍康复门诊",
              children: [
                {
                  value: "林弈涛",
                  label: "林弈涛",
                  children: [
                    {
                      value: "80",
                      label: "80",
                    },
                  ],
                },
              ],
            },
            {
              value: "新冠心肺功能康复门诊",
              label: "新冠心肺功能康复门诊",
              children: [
                {
                  value: "胡华玲",
                  label: "胡华玲",
                  children: [
                    {
                      value: "30",
                      label: "30",
                    },
                  ],
                },
              ],
            },
          ],
        },
        //呼吸内科门诊
        {
          value: "呼吸内科门诊",
          label: "呼吸内科门诊",
          children: [
            {
              value: "呼吸内科门诊",
              label: "呼吸内科门诊",
              children: [
                {
                  value: "何银辉",
                  label: "何银辉",
                  children: [
                    {
                      value: "50",
                      label: "50",
                    },
                  ],
                },
              ],
            },
          ],
        },
        //肾病内分泌科门诊
        {
          value: "肾病内分泌科门诊",
          label: "肾病内分泌科门诊",
          children: [
            {
              value: "肾病内分泌科门诊",
              label: "肾病内分泌科门诊",
              children: [
                {
                  value: "罗仕德",
                  label: "罗仕德",
                  children: [
                    {
                      value: "50",
                      label: "50",
                    },
                  ],
                },
              ],
            },
          ],
        },
        //心血管内科
        {
          value: "心血管内科",
          label: "心血管内科",
          children: [
            {
              value: "心血管内科门诊一",
              label: "心血管内科门诊一",
              children: [
                {
                  value: "李旭",
                  label: "李旭",
                  children: [
                    {
                      value: "40",
                      label: "40",
                    },
                  ],
                },
              ],
            },
            {
              value: "心血管内科门诊二",
              label: "心血管内科门诊二",
              children: [
                {
                  value: "刘春华",
                  label: "刘春华",
                  children: [
                    {
                      value: "50元",
                      label: "50元",
                    },
                  ],
                },
              ],
            },
          ],
        },
        //高血压专病门诊
        {
          value: "高血压专病门诊",
          label: "高血压专病门诊",
          children: [
            {
              value: "高血压专病门诊",
              label: "高血压专病门诊",
              children: [
                {
                  value: "李庆",
                  label: "李庆",
                },
              ],
            },
          ],
        },
        //老年病科门诊
        {
          value: "老年病科门诊",
          label: "老年病科门诊",
          children: [
            {
              value: "老年病科门诊、老年新冠康复门诊",
              label: "老年病科门诊、老年新冠康复门诊",
              children: [
                {
                  value: "李新",
                  label: "李新",
                },
              ],
            },
          ],
        },
        //脑病科
        {
          value: "脑病科",
          label: "脑病科",
          children: [
            {
              value: "脑病科",
              label: "脑病科",
              children: [
                {
                  value: "吴清明",
                  label: "吴清明",
                },
              ],
            },
          ],
        },
        //儿科
        {
          value: "儿科",
          label: "儿科",
          children: [
            {
              value: "儿科门诊",
              label: "儿科门诊",
              children: [
                {
                  value: "詹红艳",
                  label: "詹红艳",
                },
              ],
            },
          ],
        },
        {
          value: "骨伤、脊柱、康复",
          label: "骨伤、脊柱、康复",
          children: [
            {
              value: "axure",
              label: "Axure Components",
            },
            {
              value: "sketch",
              label: "Sketch Templates",
            },
            {
              value: "jiaohu",
              label: "组件交互文档",
            },
          ],
        },
      ],
    };
  },
  methods: {
    formatter(row, column) {
      return row.address;
    },
    //查询健康卡
    healthCardMarkSearch() {
      console.log(this.healthCardMark);
      api({
        url: "/hrs/byStatusid/" + this.healthCardMark,
        method: "get",
      }).then((res) => {
        console.log(res.data.pname);
        if (res.data.pname != undefined) {
          this.healthName = "用户：'" + res.data.pname + "'" + "查询成功！";
        } else {
          this.healthName = res.data.pname;
        }
      });
    },
    //获取级联菜单
    handleChange(value) {
      this.patientRules.toInfo = value[0] + "-" + value[1];
      this.patientRules.rDoctorName = value[2];
      this.patientRules.dMoney = value[3];
    },
    //
    notarizeReg() {
      console.log(
        this.patientRules.toInfo +
          " " +
          this.patientRules.dMoney +
          " " +
          this.patientRules.rPaymentType +
          " " +
          this.patientRules.regTime +
          " " +
          this.patientRules.rOutpatient +
          " " +
          this.patientRules.rDoctorName
      );
      // api({
      //   url: "/hrsRegNew/insertReg/",
      //   method: "post",
      //   params: {
      //     toInfo: decodeURIComponent(this.patientRules.toInfo),
      //     rMoney: decodeURIComponent(this.patientRules.dMoney),
      //     rPaymentType: decodeURIComponent(this.patientRules.rPaymentType),
      //     rVisitTime: decodeURIComponent(this.patientRules.regTime),
      //     rOutpatient: decodeURIComponent(this.patientRules.rOutpatient),
      //     rDoctorName: decodeURIComponent(this.patientRules.rDoctorName),
      //   },
      // }).then((res) => {
      //   console.log(res);
      // });
      api({
        url: "/hrsRegNew/insertReg/",
        method: "post",
        headers: {
          "Content-Type": "application/json", //设置请求头请求格式为JSON
          access_token: this.token, //设置token 其中K名要和后端协调好
        },
        params: {
          toInfo: "呼吸内科门诊-呼吸内科门诊",
          rMoney: this.patientRules.dMoney,
          rPaymentType: "微信支付",
          rVisitTime: this.patientRules.regTime,
          rOutpatient: "23041823",
          rDoctorName: "何银辉",
        },
      }).then((res) => {
        console.log(res);
        this.$router.go(0);
      });
    },
    //
    deleteRid(rId) {
      api({
        url: "/hrsRegNew/delete?rId=" + rId,
        method: "post",
      }).then((res) => {
        console.log(res);
        this.$router.go(0);
      });
    },
  },
};
</script>

<style scoped>
* {
  padding: 0;
  margin: 0;
}

.aa {
  width: 100%;
  height: 100%;
  background: #fff;
  box-sizing: border-box;
}
.regbtn {
  width: 19%;
  height: 60px;
}

.el-row {
  margin-bottom: 20px;
}
.el-col {
  border-radius: 4px;
}

.bg-purple {
  height: 60px;
  background: #419ee9;
  text-align: center;
  line-height: 60px;
  font-size: 18px;
  color: #fff;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

.space {
  margin-bottom: 20px;
}

.state {
  margin-left: 10px;
  font-size: 22px;
  font-weight: bold;
  color: #67c23a;
}
</style>